<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Tabs Queue</title>
  <link rel="stylesheet" href="popup.css" />
  <link rel="stylesheet" href="common.css" />
  <link rel="stylesheet" href="onoff-switch.css" />
</head>

<body>
  <h1 id="queueToLimit" class="clickable">Tabs Queue</h1>
  <div class="onoffswitch">
    <input type="checkbox" id="myonoffswitch" name="onoffswitch" class="onoffswitch-checkbox" checked>
    <label class="onoffswitch-label" for="myonoffswitch">
      <span class="onoffswitch-inner"></span>
      <span class="onoffswitch-switch"></span>
    </label>
  </div>
  <!--<div class="left"></div>
  <div class="right">
    <button id="queueToLimit" class="btn">Queue to fit limit</button>
  </div>-->
  <!--Saved queues-->
  <div class="section">
    <div class="caption">
      <div class="left">
        <h2 id="savedQueuesInfo">Saved queues</h2>
      </div>
      <div class="right">
        <button id="buttonRestoreAll" class="btn">Restore all</button>
        <button id="buttonClearQueues" class="btn">Clear all</button>
        <div class="dialog-clear" data-for="buttonClearQueues">
          <span>Are you sure?</span>
          <button name="clearYes" class="btn">Yes</button>
          <button name="clearNo" class="btn">No</button>
        </div>
      </div>
    </div>
    <ol id="savedQueuesList" class="list-level1">
    </ol>
  </div>
  <!---->
  <!--Current queue-->
  <div class="section">
    <div class="caption">
      <div class="left">
        <h2 id="urlListInfo">Queue is empty</h2>
      </div>
      <div class="right">
        <button id="buttonClearItems" class="btn">Clear all</button>
        <!--Hidden confirmation dialog-->
        <div class="dialog-clear" data-for="buttonClearItems">
          <span>Are you sure?</span>
          <button name="clearYes" class="btn">Yes</button>
          <button name="clearNo" class="btn">No</button>
        </div>
      </div>
    </div>
    <ol id="url-list" class="list-level1">
    </ol>
  </div>
  <!---->
  <script src="libs/Sortable.min.js"></script>
  <script src="popup.js"></script>
</body>

</html>
